<template>
	<view class="big-box">

			<view v-for="(item, index) of applies" :key="item.id" class="appyl-list">
				<view class="appyl-list-top">
					<view class="appyl-list-top-name">商家名称：{{ item.storeName }}</view>
					<view v-if="item.status === '0'" class="appyl-list-top-state statedsh">待预审</view>
					<view v-if="item.status === '1'" class="appyl-list-top-state statedsh">预审通过</view>
					<view v-if="item.status === '2'" class="appyl-list-top-state statedsh">预审失败</view>
					<view v-if="item.status === '3'" class="appyl-list-top-state statedsh">待平台审核</view>
					<view v-if="item.status === '4'" class="appyl-list-top-state statedsh">平台审核成功</view>
					<view v-if="item.status === '5'" class="appyl-list-top-state statedsh">平台审核失败</view>
				</view>
				<view class="appyl-list-bottom">
					<view class="appyl-list-bottom-one">
						<view class="appyl-list-bottom-one-text"><text>联系人：{{ item.contract }}</text></view>
						<view class="appyl-list-bottom-one-text">
							<text>联系电话：{{ item.phone }}</text>
							<image @click="onClickPhone(item.phone)" src="../../static/phone.png"></image>
						</view>
					</view>
					<view class="appyl-list-bottom-two">行业类型：{{ item.industryId }}</view>
					<view class="appyl-list-bottom-two">申请时间：{{ item.createdAt }}</view>
					<view class="appyl-list-bottom-two">地址：{{ item.province }}{{ item.city }}{{ item.area }}{{ item.address }}</view>
				</view>
				<view class="appyl-list-btn">
					<view v-if="item.status === '0'" class="appyl-list-btn-one" @click="jujue()">拒绝申请</view>
					<view @click="onClickTG(item.id)" v-if="item.status === '0'" class="appyl-list-btn-two">通过预审</view>
					<view @click="gosupp(item.id)" v-if="item.status === '1'" class="appyl-list-btn-two">补充信息</view>
				</view>
				
				<view class="refusal" v-if="item.status === '0'" >
					<view class="refusal-input">
						<input type="text" placeholder="请输入拒绝理由" class="refusal-inputs" placeholder-class="placeholder" />
						<view @click="item.remark = ''" class="refusal-input-close">×</view>
					</view>
					<view @click="refusal(item.id, item.status, item.remark)" class="tj-btn">提交</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import { config } from '@/utils/config.js';
	export default {
		data() {
			return {
				h5ListHeight: 0,
				appListHeight: 0,
				selectIndex: -1,
				// 全部
				applies: [],
				page: 1,
				size: 10,
				total: 0,
				totalPage: 0,
			}
		},
		onPullDownRefresh() {
			if (this.selectIndex === -1) {
				this.applies = []
				this.page = 1
				this.size = 10
				this.total = 0
				this.totalPage = 0
			} 
		},
		props:{
			status:{
				type: Number
			}
		},
		mounted() {
		
			this._getApplies(status)
		},
		methods: {
			// 补充信息
			gosupp(id){
				uni.redirectTo({
					url:"../../pages/supplementary/supplementary?id="+id
				})
			},
			// 获取数据===========
			_getApplies(status){
			
				let data={}
				if(status!==-1){
					data={"status":status}
				}
				let page = this.page;
				let size = this.size;
				uni.request({
					url:`${config.api_base_url}/agent/agent/applications/${page}/${size}`,
					header: {
						AUTH: 'ROBOT ' + uni.getStorageSync('d_token')
					},
					data:data,
					method:'POST',
					success: (res) => {
						console.log(res.data.data)
						let { status, data } = res.data
						if (status.flag === true) {
							this.applies = data
						} else {
							uni.showToast({
								title: '请求异常',
								icon: 'none'
							})
						}
					}
				})
			},
			// 拒绝===============
			jujue(){
				
			},
						refusal(applies,index) {
							if (isrefusal === true) {
								if (!remark) {
									uni.showToast({
										icon: 'none',
										title: '请先填写拒绝的理由'
									})
									return false
								}
							}
							uni.request({
								url: `${config.api_base_url}admin/merchant_apply/secondTrial/2/${id}`, // 这个2就是拒绝的意思
								method: 'PUT',
								data: {
									remark: remark
								},
								header: {
									AUTH: 'ROBOT ' + uni.getStorageSync('d_token')
								},
								success: ((res) => {
									console.log(res)
								}),
								fail: err => {
									console.log(err)
								}
							})
						},
						// 通过
			// 通过==================
			onClickTG(id) {
							if (!id) {
								uni.showToast({
									icon: 'none',
									title: '暂未获取到id, 无法通过'
								})
								return false
							}
							uni.request({
								url: `${config.api_base_url}agent/agent/application/firstTrial/1/${id}`, // 这个2就是拒绝的意思
								method: 'PUT',
								data: {},
								header: {
									AUTH: 'ROBOT ' + uni.getStorageSync('d_token')
								},
								data:{},
								success: ((res) => {
									let { status, data } = res.data
									if (status.flag === true) {
										if (this.selectIndex === -1) {
											this.applies = []
											this.page = 1
											this.size = 10
											this.total = 0
											this.totalPage = 0
											this._getApplies(status)
										} 
									} else {
										uni.showToast({
											icon: 'none',
											title: data.msg
										})
									}
								}),
								fail: err => {
									console.log(err)
								}
							})
						},
		},
		
	}
</script>

<style scoped>
	.big-box{
		/* height:1000rpx; */
		/* overflow: initial; */
	}
	.merchant-list {
		width: 100%;
	}
	
	.merchant-list-title {
		width: 100%;
		height: 66rpx;
		line-height: 66rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0rpx 20rpx;
		background-color: #f5f5f5;
	}
	
	.merchant-list-title-li {
		font-size: 24rpx;
		font-weight: 600;
		line-height: 64rpx;
		color: rgba(0, 0, 0, 0.85);
		line-height: 64rpx;
		text-align: center;
	}
	
	.active {
		color: #f02230;
	}
	
	.merchant-list-list {
		box-sizing: border-box;
		padding-left: 16rpx;
		padding-right: 14rpx;
		width: 100%;
		display: flex;
		align-items: center;
		flex-direction: column;
	}
	
	.appyl-list {
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 4rpx 12rpx 0px rgba(0, 0, 0, 0.05);
		border-radius: 12rpx;
		padding: 0rpx 30rpx;
		box-sizing: border-box;
		margin-bottom: 12rpx;
		width: 100%;
	}
	
	.appyl-list-top {
		height: 72rpx;
		border-bottom: 2rpx solid #eeeeee;
	}
	
	.appyl-list-top-name {
		font-size: 28rpx;
		line-height: 72rpx;
		height: 72rpx;
		color: #333;
		float: left;
		max-width: 500rpx;
	/* 	overflow: hidden;
		text-overflow: ellipsis; */
		white-space: nowrap;
	}
	
	.appyl-list-top-state {
		font-size: 28rpx;
		line-height: 72rpx;
		height: 72rpx;
		color: #333;
		float: right;
	}
	
	.statedsh {
		color: rgba(247, 181, 0, 1);
	}
	
	.stateystg {
		color: #6dd400;
	}
	
	.stateyssb {
		color: #f02230;
	}
	
	.appyl-list-bottom {
		padding: 5rpx 0rpx;
		box-sizing: border-box;
	}
	
	.appyl-list-bottom-one {
		overflow: hidden;
	}
	
	.appyl-list-bottom-one-text {
		float: left;
	}
	
	.appyl-list-bottom-one-text:nth-child(1) {
		margin-right: 70rpx;
	}
	
	.appyl-list-bottom-one-text text {
		font-size: 28rpx;
		color: #333;
		line-height: 50rpx;
		height: 50rpx;
		float: left;
	}
	
	.appyl-list-bottom-one-text image {
		width: 28rpx;
		height: 34rpx;
		display: block;
		margin: 8rpx 14rpx 0rpx;
		float: left;
	}
	
	.appyl-list-bottom-two {
		font-size: 28rpx;
		color: #333;
		line-height: 50rpx;
	}
	
	.appyl-list-btn {
		border-top: 2rpx solid #eeeeee;
		height: 78rpx;
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
	
	.appyl-list-btn-one {
		width: 132rpx;
		height: 50rpx;
		border-radius: 12rpx;
		border: 2rpx solid rgba(240, 34, 48, 1);
		font-size: 24rpx;
		color: #f02230;
		line-height: 50rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.appyl-list-btn-two {
		width: 132rpx;
		height: 50rpx;
		border-radius: 12rpx;
		border: 2rpx solid #0091ff;
		font-size: 24rpx;
		color: #0091ff;
		line-height: 50rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-left: 20rpx;
	}
	
	.refusal {
		padding-top: 20rpx;
		position: relative;
		/* overflow: hidden; */
	}
	
	/* .refusal::after {
		position: absolute;
		content: '';
		width: 0;
		height: 0;
		border-right: 14rpx solid transparent;
		border-left: 14rpx solid transparent;
		border-bottom: 20rpx solid #fff;
		top: -18rpx;
		right: 206rpx;
	} */
	
	.refusal::before {
		position: absolute;
		content: '';
		width: 0;
		height: 0;
		border-right: 18rpx solid transparent;
		border-left: 18rpx solid transparent;
		border-bottom: 22rpx solid #c6c6c6;
		top: 0;
		right: 202rpx;
	}
	
	.refusal-input {
		width: 100%;
		height: 80rpx;
		border-radius: 12rpx;
		border: 2rpx solid rgba(221, 221, 221);
		display: flex;
		align-items: center;
		box-sizing: border-box;
	}
	
	.refusal-inputs {
		padding: 0;
		margin: 0;
		outline: none;
		border: none;
		width: calc(100% - 60rpx);
		height: 100%;
		box-sizing: border-box;
		padding-left: 22rpx;
		font-size: 30rpx;
		line-height: 80rpx;
		color: #333;
	}
	
	.refusal-input-close {
		width: 30rpx;
		height: 30rpx;
		border-radius: 50%;
		background-color: #c6c6c6;
		line-height: 30rpx;
		text-align: center;
		color: #fff;
		font-size: 28rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.placeholder {
		color: #cccccc;
	}
	
	.tj-btn {
		width: 132rpx;
		height: 50rpx;
		border-radius: 12rpx;
		border: 2rpx solid #0091ff;
		font-size: 24rpx;
		color: #0091ff;
		line-height: 50rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		float: right;
		margin: 15rpx 0rpx 25rpx;
	}

</style>
